<style>
  .InfosBox .w-70 {
    width: 70%;
  }
  .InfosBox .u-bg-fff {
    background: #fff;
  }
</style>
<div class="CommonHeader">
  <div class="CommonBackBtn">
    <a href="javascript:history.go(-1)"
      ><img src="__CDN__/map/images/return_black.png" alt="返回"
    /></a>
  </div>
  <div class="CommonTitle">添加收货地址</div>
</div>

<div class="CommonMain">
  <div class="InfosBox ">
    {:token()}
    <div class="InfostDiv am-cf">
      <span class="am-fl">联系人</span>
      <input
        class="am-fl w-70"
        type="text"
        name="name"
        value="{$adree.name}"
        placeholder="请输入"
      />
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">手机</span>
      <input
        class="am-fl w-70"
        type="text"
        value="{$adree.phone}"
        name="phone"
        placeholder="请输入"
      />
      <span>手机号输入格式不正确，请重新输入</span>
    </div>

    <div class="InfostDiv am-in">
      <span class="am-fl">省选择</span>
      <select id="addarea_sheng" class="am-fl w-70 u-bg-fff" name="province_id">
        {$option.prov}
      </select>
    </div>
    <div class="InfostDiv am-in">
      <span class="am-fl">市选择</span>

      <select  id="addarea_shi" class="am-fl w-70 u-bg-fff" name="city_id">
        {$city_id}
      </select>
    </div>
    <div class="InfostDiv am-in">
      <span class="am-fl">地区选择</span>

      <select id="addarea_quxian" class="am-fl w-70 u-bg-fff" name="region_id">
        {$region_id}
      </select>
    </div>
    <div class="InfostDiv am-cf">
      <span class="am-fl">地址</span>
      <input
        class="am-fl w-70"
        type="text"
        value="{$adree.detail}"
        name="detail"
        placeholder="请输入收货详细地址"
      />
    </div>
  </div>
  <div class="DmBtn Mt70">
    <input class="gradualBg" type="button" value="保存" />
  </div>
</div>
<style>
  .InfostDiv span:last-child{display:none;width:auto;position: absolute;top:0;right:0.6rem;font-size: 0.22rem;color:red;}
  {if $adree.name}
  select{
      color: #323232 !important;
  }
  option{
      color: #323232;
  }
  {/if}
</style>

<script>
  var http_url = "{$http_url}"
  $("#addarea_sheng").change(function() {
    var provid = $("#addarea_sheng").val()
    $.get("{:url('user/getRegion')}?pid=" + provid + "&ajax=1", function(data) {
      $("#addarea_shi").show(0, function() {
        $(this).html(data)
      })
    })
  })

  $("#addarea_shi").change(function() {
    var provid = $("#addarea_shi").val()
    $.get("{:url('user/getRegion')}?pid=" + provid + "&ajax=1", function(data) {
      $("#addarea_quxian").show(0, function() {
        $(this).html(data)
      })
    })
  })

  $(".gradualBg").on("click", function() {
    var name = $("input[name='name']").val()
    var phone = $("input[name='phone']").val()
    var province_id = $("select[name='province_id']").val()
    var city_id = $("select[name='city_id']").val()
    var region_id = $("select[name='region_id']").val()
    var detail = $("input[name='detail']").val()
    var token = $("input[name='__token__']").val()
    var myreg = /^[1][3,4,5,7,8,9][0-9]{9}$/
    if (!myreg.test(phone)) {
      alert("请填写正确的手机号码")
      return false
    }

    if (phone.length != 11) {
      alert("手机号码必须11位")
      return false
    }
    $.ajax({
      type: "POST",
      url: "{$http_url}/index/user/adress",
      dataType: "json",
      data: {
        name: name,
        phone: phone,
        province_id: province_id,
        city_id: city_id,
        region_id: region_id,
        detail: detail,
        __token__: token
      },
      success: function(data) {
        if (data.code > 0) {
          alert("保存成功")
          // javascript:history.go(-1)
          window.location.href = "{:url('user/set')}"
          // window.location.href=http_url+data.url;
        } else {
          $("input[name='__token__']").val(data.token)
          alert(data.msg)
        }
      },
      error: function(jqXHR) {
        console.log("Error: " + jqXHR.status)
      }
    })
  })
  $("[name=phone]")
    .focus(function() {
      $(this)
        .next()
        .hide()
    })
    .blur(function() {
      if (!new RegExp("^1[34578]\\d{9}$").test($(this).val())) {
        $(this)
          .next()
          .show()
      }
    })
</script>
